<style lang="less" scoped>
.unit-list{
	li{
		width: 50%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis
	}
}
</style>
<template>
	<div class="notice-new">
		<el-form label-width="150px">
			<el-form-item label="通知类型：">{{activeData.announcementTypeName}}</el-form-item>
			<el-form-item label="内容描述：">{{activeData.contentDes}}</el-form-item>
		  	<el-form-item label="相关附件：" >
		  		<p v-if="!activeData.ishaveFile">无</p>
		  		<a :href="activeData.filePath">{{activeData.fileName}}</a>
		  	</el-form-item>
		  	<template v-if="siteInfos.userType==1">
				<el-form-item label="通知类别：">
			  		<p v-if="activeData.ishaveReceivingUnit">指定单位通告，单位列表如下</p>
			  		<p v-else>公共通告</p>
			  	</el-form-item>
			  	<el-form-item label="接收单位：" v-if="activeData.ishaveReceivingUnit">
			  		<p v-if="activeData.allflag">下辖所有单位即可</p>
			  		<ul class="unit-list flex wrap" v-else>
			  			<li v-for="(item,index) in receivingUnitNames" :key="index">{{item}}</li>
			  		</ul>
			  	</el-form-item>
		  	</template>
		  	
		</el-form>
	</div>	
</template>
<script>
import { mapState } from 'vuex'
export default {
	name: 'noticeDetail',
	props: {
		activeData: {
			type: Object,
			default () {
				return {
					receivingUnitNames: []
				}
			}
		}
	},
	computed: {
		...mapState([
			'siteInfos'
		]),
		receivingUnitNames () {
			if(this.siteInfos.userType==2){
				return []
			}
			let units = []
			if(this.activeData.ishaveReceivingUnit){
				if(this.activeData.allflag){
					this.getUnits(data=>{
						units = data.map(item=>item.name)
					})
				}else{
					units =  this.activeData.receivingUnitNames.split(',')
				}
			}
			return units
		}
	},
	data () {
		return {}
	},
	methods: {
		getUnits (areaId,cbk) {
			this.$get('/business/business/businessList', {
            	area: this.activeData.bottomArea
            }).then(res => {
            	cbk && cbk(res.data)
            }, (err) =>{
				if(err.msg){
					this.$message.error(err.msg);
				}
            })
		}
	},
	created () {
		
	},
}
</script>